<!DOCTYPE html>
<html xmlns:th="https://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" >
<head>
    <meta charset="utf-8">
    <title>你饿么订餐</title>
    <!-- 依 赖 样 式 -->
    <link rel="stylesheet" href="/component/pear/css/pear.css" />
    <!-- 加 载 样 式-->
    <link rel="stylesheet" href="/admin/css/load.css" />
    <!-- 布 局 样 式 -->
    <link rel="stylesheet" href="/admin/css/admin.css" />
    <!-- 引入 layui.css -->
    <link rel="stylesheet" href="//unpkg.com/layui@2.6.7/dist/css/layui.css">
    <!-- 引入 layui.js -->
    <script src="//unpkg.com/layui@2.6.7/dist/layui.js"></script>
</head>
<body>
<script>

</script>
<div class="layui-layout layui-layout-admin">

    <div th:insert="~{front/header::#header}"></div>
    <div th:insert="~{front/left::#left}"></div>



    <div class="layui-body" >

            <!-- 内容主体区域 -->
            <!-- 轮播 -->
            <div class="layui-carousel layui-col-md12" id="carousel-container">
                <div carousel-item>
                    <div>
                        <img th:src="@{/carousel/food1.jpg}" style="width: 100%;height: auto">
                    </div>
                    <div>
                        <img th:src="@{/carousel/food2.jpg}" style="width: 100%;height: auto">
                    </div>
                    <div>
                        <img th:src="@{/carousel/food3.jpg}" style="width: 100%;height: auto">
                    </div>
                </div>
            </div>
    </div>

    <!-- 底部区域 -->
    <div class="layui-footer">
        欢迎光临!
        <!--        <div class="layui-fluid"  >-->
<!--            <div class="layui-row" style="" >-->
<!--                <div class="layui-col-md3 " style="margin-top: 15px"  >-->
<!--                    &lt;!&ndash; 字段区块 &ndash;&gt;-->
<!--                    <fieldset class="layui-elem-field layui-field-title">-->
<!--                        <legend><h3>网站简介</h3></legend>-->
<!--                        <div class="layui-field-box">-->
<!--                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;这是一个神奇的网站!这是一个神奇的网站!这是一个神奇的网站! &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-->
<!--                            点啥有啥吃的!真的,不信试一试!-->
<!--                        </div>-->
<!--                    </fieldset>-->

<!--                </div>-->

<!--                &lt;!&ndash; 字段区块 &ndash;&gt;-->
<!--                <div class="layui-col-md3 layui-col-md-offset1" style="margin-top: 15px" >-->
<!--                    <fieldset class="layui-elem-field layui-field-title">-->
<!--                        <legend><h3>你饿么在线订餐</h3></legend>-->
<!--                        <div class="layui-field-box">-->
<!--                            <ul>-->
<!--                                <li>真好吃!</li>-->
<!--                                <li>真好吃!</li>-->
<!--                                <li>真好吃!</li>-->
<!--                                <li>真好吃!</li>-->
<!--                            </ul>-->
<!--                        </div>-->
<!--                    </fieldset>-->
<!--                </div>-->

<!--                &lt;!&ndash; 字段区块 &ndash;&gt;-->
<!--                <div class="layui-col-md3 layui-col-md-offset1" style="margin-top: 15px" >-->
<!--                    <fieldset class="layui-elem-field layui-field-title">-->
<!--                        <legend>-->
<!--                            <h3>订餐电话</h3>-->
<!--                        </legend>-->
<!--                        <div class="layui-field-box">-->
<!--                            <p>电话 </p> <li> 155xxxxxxxx</li>-->
<!--                        </div>-->
<!--                    </fieldset>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
    </div>
</div>

<script>
    //JS
    layui.use(['element', 'layer', 'util','carousel'], function(){
        var element = layui.element
            ,layer = layui.layer
            ,util = layui.util
            ,$ = layui.$
            ,carousel = layui.carousel;

            //建造实例
            carousel.render({
                elem: '#carousel-container'
                ,width: '100%' //设置容器宽度
                ,height: '650px'
                ,full: true // 是否满屏
                // ,arrow: 'hover' //悬停显示箭头
                //,anim: 'updown' //切换动画方式
            });

    });


    function updatePassword() {
        layer.open({
            type: 2,
            title: '修改密码',
            shade: 0.1,
            area: ['600px', '450px'],
            content: '/user/updatePassword'
        });
    }
</script>
</body>
</html>